2.3 Frontend Web Technologies

How to describe the structure, i.e., content of HTML elements, of web documents - HTML
- Do you know what HTML stands for? Names always have meaning.
- What is the main purpose of HTML?
  - Read 'What is HTML?' in HTML & CSS.
  - Read the first answer in What is the purpose of HTML?.
- What is HTML5?
  - Read the first three paragraphs in HTML5.
How to describe the presentation of web documents - CSS
- Do you know what CSS stands for?
- What is the main purpose of CSS?
  - Read the first two paragraphs in Cascading Style Sheets.
  - Read the first two paragraphs in Using CSS to style HTML.
- What is CSS3?
How to allow programs to dynamically access/update the content, structure and style of documents - DOM
- What does DOM stand for?
- What is the main purpose of DOM?
  - Read 'What is the Document Object Model?' and 'Why the Document Object Model?' in Document Object Model (DOM).
How to dynamically access/update the content, structure and style of documents - JavaScript
- What is the purpose of JavaScript?
  - Read 'The purpose of JavaScript is to solve this problem' in What is JavaScript Used For?.
  - Read all in JavaScript and HTML to find how they work together!
  - How to connect HTML objects to JavaScript? How to access HTML objects from JavaScript?
    - Basically JavaScript code reacts to events such as mouse, keyboard, timer, and system.
    - E.g., can you see the change of mouse pointer and the colors when you move the mouse? JavaScript is used in the web program to react the mouse movement.
How to keep data - database systems

Learning outcomes
- Explain the roles of HTML.
- Explain the roles of CSS.
- Explain how CSS can be used to control HTML objects.
- Explain what DOM is.
- Explain how JavaScript can be used user interaction.

2.3 Frontend Web Technologies - Overview